<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="lib/vue.js"></script>
    <style scoped>
        div{
            background-color: #0099cc;
        }
    </style>
</head>
<body>
<div id="app">
    <heade></heade>
    <bdy></bdy>
    <foote></foote>
</div>
<script>
    Vue.component("heade",{
      template:"<h3>我是头</h3>"
    })
    Vue.component("bdy",{
      template:"<h3>我是中</h3>"
    })
    Vue.component("foote",{
      template:"<h3>我是尾巴</h3>"
    })
    new Vue({
      el:"#app",
      data(){
        return{
        }
      },
      methods:{
        //必须声明compenents
        // compenents:{
          // 组件名字：组件对象
          // heade,
          // bdy,
          // foote,
        // }
      }
    })
</script>
</body>
</html>